<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>工作者线程</title>
</head>
<body>
    <div class="main">
        <h1>工作者线程实例</h1>
        <div class="con">
            <p id="current"></p>
            <p id="sum"></p>
            <h5>项目架构</h5>
            <pre>
            <code>
/your-project-folder  
    ├── index.html  
    ├── main.js  
    └── worker.js
            </code>
            </pre>
        </div>
        
        <div class="info">
            <h4>工作者线程简介</h4>
            JavaScript 环境实际上是运行在托管操作系统中的虚拟环境。在浏览器中每打开一个页面，就会分 配一个它自己的环境。这样，每个页面都有自己的内存、事件循环、DOM，等等。每个页面就相当于 一个沙盒，不会干扰其他页面。对于浏览器来说，同时管理多个环境是非常简单的，因为所有这些环境 都是并行执行的。 使用工作者线程，浏览器可以在原始页面环境之外再分配一个完全独立的二级子环境。这个子环境 不能与依赖单线程交互的 API（如 DOM）互操作，但可以与父环境并行执行代码。
            <h4>专用工作者线程</h4>
            专用工作者线程是最简单的 Web 工作者线程，网页中的脚本可以创建专用工作者线程来执行在页面 线程之外的其他任务。这样的线程可以与父页面交换信息、发送网络请求、执行文件输入/输出、进行密 集计算、处理大量数据，以及实现其他不适合在页面执行线程里做的任务（否则会导致页面响应迟钝）。
            <h4>共享工作者线程</h4>
            共享工作者线程或共享线程与专用工作者线程类似，但可以被多个可信任的执行上下文访问。例如， 同源的两个标签页可以访问同一个共享工作者线程。SharedWorker 与 Worker 的消息接口稍有不同， 包括外部和内部。 共享线程适合开发者希望通过在多个上下文间共享线程减少计算性消耗的情形。比如，可以用一个 共享线程管理多个同源页面 WebSocket 消息的发送与接收。共享线程也可以用在同源上下文希望通过一 个线程通信的情形。
            <h4>服务工作者线程</h4>
            服务工作者线程（service worker）是一种类似浏览器中代理服务器的线程，可以拦截外出请求和缓 存响应。这可以让网页在没有网络连接的情况下正常使用，因为部分或全部页面可以从服务工作者线程 缓存中提供服务。服务工作者线程也可以使用 Notifications API、Push API、Background Sync API 和 Channel Messaging API。 与共享工作者线程类似，来自一个域的多个页面共享一个服务工作者线程。不过，为了使用 Push API 等特性，服务工作者线程也可以在相关的标签页或浏览器关闭后继续等待到来的推送事件。 无论如何，对于大多数开发者而言，服务工作者线程在两个主要任务上最有用：充当网络请求的 缓存层和启用推送通知。在这个意义上，服务工作者线程就是用于把网页变成像原生应用程序一样的 工具
        </div>
        <br>
        <button onclick="jcclose()">终止工作线程</button>
    </div>
    <script src="./main.js"></script>
</body>
</html>